<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>结算</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit|ie-stand">
    <meta name="description" content="结算">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="../style/base.css">
    <link rel="stylesheet" type="text/css" href="../style/page/placeOrder.css">
    <link rel="stylesheet" type="text/css" href="../style/toastr.css">
</head>
<body style="background-color: #f1f1f1;">
    <div class="log_top">
        <div class="log_text">
            <div class="log_text_l">结算</div>
            <div class="log_text_r">
<!--                <a href="./address.html" class="new_log">收货地址</a>-->
                <a href="./log.html" class="new_log">我的订单</a>
                <a href="./coupon.html" class="new_log">我的优惠券</a>
                <a href="../index.html">首页</a>
            </div>
        </div>
    </div>
    <div class="box">
        <!-- <div class="box-header">
            <div class="h_swiper">
                <div><img class="nav_img" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3812540320,512984909&fm=26&gp=0.jpg"></div>
            </div>
        </div> -->
        <!--  订单列表 -->
        <div class="box_main" style="margin-top: 40px;">
            <div class="title">结算</div>
            <div class="order_title">
                <div class="t_item">示例图</div>
                <div class="t_item">菜名</div>
                <div class="t_item">单价</div>
                <div class="t_item">数量</div>
                <div class="t_item">操作</div>
            </div>
            <div class="list_box">
                <div class="order_list">
<!--                    <div class="order_img">-->
<!--                        <img src="https://pic.dominos.com.cn:8443/ApiPicture/20201210/9310b6c4a87744c895f37cb31d6edf5e.jpg" alt="">-->
<!--                    </div>-->
<!--                    <div class="caiName">日式照烧滋烤鳗鱼比萨</div>-->
<!--                    <div class="o_price">￥56元</div>-->
<!--                    <div class="o_price">2</div>-->
                </div>
            </div>

            <!-- <table id="jsTrolley">
                <thead>
                    <tr>
                        <th></th>
                        <th>示例图</th>
                        <th>菜名</th>
                        <th>价格</th>
                        <th>数量</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td></td>
                        <td>产品1</td>
                        <td>产品1</td>
                        <td>10.00</td>
                        <td>10.00</td>
                        <td><a href="javascript:void(0);">删除</a></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>产品2</td>
                        <td>产品2</td>
                        <td>30.20</td>
                        <td>30.20</td>
                        <td><a href="javascript:void(0);">删除</a></td>
                    </tr>
                    <tr>
                        <td><input type="checkbox" id="chElt" name="quanxuan"/></td>
                        <td>产品3</td>
                        <td>产品3</td>
                        <td>20.50</td>
                        <td>20.50</td>
                        <td><a href="javascript:void(0);">删除</a></td>
                    </tr>
                </tbody>
                <tfoot>
                    <tr>
                        <th>全选<input type="checkbox" id="chElt" name="quanxuan" onclick="checkOrCancelAll();"/></th>
                        <th></th>
                        <th>总金额</th>
                        <th style="color: #222; font-weight: 600;font-size: 18px;">￥ 350元</th>
                        <th >总数量</th>
                        <td style="color: red; font-weight: 600;font-size: 18px;">15</td>
                    </tr>
                </tfoot>
            </table> -->



            <div class="order_title">
<!--                <div class="t_item">全选<input style="margin-left: 20px;" type="checkbox" id="chElt" name="quanxuan" onclick="checkOrCancelAll();"/></div>-->
                <div class="t_item"></div>
                <div class="t_item">总金额 <span style="color: #222; font-weight: 600;font-size: 18px;">￥<span class="totalMoney"></span>元</span></div>
                <div class="t_item">总数量 <span class="totalNumber" style="color: red; font-weight: 600;font-size: 18px;">0</span></div>
                <div class="t_item"></div>
            </div>
            <div class="order_title">
                <div class="t_item">选择优惠卷:
                    <select id="selectCoupon" onchange="chooseCoupon()">
                        <option value="0">请选择</option>
                    </select>
                </div>
                <div class="t_item">优惠金额 <span style="color: #222; font-weight: 600;font-size: 18px;">￥<span class="preferentialMoney"></span>元</span></div>
            </div>
            <div class="order_title">
<!--                <div class="t_item">选择优惠卷<input style="margin-left: 20px;" type="checkbox" id="chElt" name="quanxuan" onclick="checkOrCancelAll();"/></div>-->
                <div class="t_item">
                </div>
                <div class="t_item">小计 <span style="color: #222; font-weight: 600;font-size: 18px;">￥<span class="subtotalMoney"></span>元</span></div>
                <div class="t_item"></div>
            </div>
            <div class="placeOrder_class mt20">
                <button type="button" class="btn-valid" id="xiadan">
                    提交
                </button>
            </div>
        </div>
        <!-- 选择收货地址 -->
        <!-- Modal -->
        <div class="modal_box">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="exampleModalLabel">选择餐台</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="order_title">
                            <div class="t_item">选择</div>
                            <div class="t_item">桌号</div>
                            <div class="t_item">类别</div>
                        </div>
                        <div class="item_box">
                            <!-- 地址列表循环 -->
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" onclick="addressCancel()">取消</button>
                        <button type="button" class="btn btn-primary" id="addressConfim">确认</button>
                    </div>
                </div>
            </div>
        </div>
        <!-- 底部 -->
        <div class="footer">
            <div>Copyright © 中国高校餐饮有限公司 | 陕ICP备2020008595号-3</div>
        </div>
    </div>
    <!-- 遮罩 -->
    <div id="zz"></div>
</body>
<script type="text/javascript" src="../script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src = "../script/swiper-3.3.1.min.js"></script>
<script type="text/javascript" src = "../script/page/placeOrder.js"></script>
<script type="text/javascript" src="../script/utils.js"></script>
<script type="text/javascript" src="../script/toastr.min.js"></script>
<script type="text/javascript">
    toastr.options = {
        timeOut: "600",
    };
</script>
</html>
